{% extends "admin/base.html" %}

{% block title %}諮詢管理 - 管理後台{% endblock %}

{% block page_title %}諮詢管理{% endblock %}

{% block content %}
<!-- 筛选器 -->
<div class="card mb-4">
    <div class="card-body">
        <div class="row align-items-center">
            <div class="col-md-6">
                <div class="btn-group">
                    <a href="{{ url_for('admin.contacts', status='all') }}" 
                       class="btn btn-outline-primary {{ 'active' if current_status == 'all' }}">
                        全部
                    </a>
                    <a href="{{ url_for('admin.contacts', status='pending') }}" 
                       class="btn btn-outline-primary {{ 'active' if current_status == 'pending' }}">
                        待處理
                    </a>
                    <a href="{{ url_for('admin.contacts', status='processed') }}" 
                       class="btn btn-outline-primary {{ 'active' if current_status == 'processed' }}">
                        已處理
                    </a>
                </div>
            </div>
            <div class="col-md-6 text-md-end">
                <span class="text-muted">
                    共 {{ contacts.total }} 條記錄
                </span>
            </div>
        </div>
    </div>
</div>

<!-- 咨询列表 -->
<div class="card">
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>姓名</th>
                        <th>電話</th>
                        <th>郵箱</th>
                        <th>諮詢內容</th>
                        <th>提交時間</th>
                        <th>狀態</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for contact in contacts.items %}
                    <tr>
                        <td>{{ contact.id }}</td>
                        <td>{{ contact.name }}</td>
                        <td>{{ contact.phone }}</td>
                        <td>{{ contact.email }}</td>
                        <td>
                            <button type="button" class="btn btn-link p-0" data-bs-toggle="modal" 
                                    data-bs-target="#messageModal{{ contact.id }}">
                                {{ contact.message[:30] }}...
                            </button>
                        </td>
                        <td>{{ contact.created_at.strftime('%Y-%m-%d %H:%M') }}</td>
                        <td>
                            {% if contact.status == 'pending' %}
                                <span class="badge bg-warning">待處理</span>
                            {% else %}
                                <span class="badge bg-success">已處理</span>
                            {% endif %}
                        </td>
                        <td>
                            <div class="btn-group">
                                <form method="POST" action="{{ url_for('admin.update_contact_status', contact_id=contact.id) }}" 
                                      class="d-inline">
                                    <input type="hidden" name="status" 
                                           value="{{ 'processed' if contact.status == 'pending' else 'pending' }}">
                                    <button type="submit" class="btn btn-sm btn-outline-primary">
                                        {{ '標記已處理' if contact.status == 'pending' else '標記待處理' }}
                                    </button>
                                </form>
                                <form method="POST" action="{{ url_for('admin.delete_contact', contact_id=contact.id) }}" 
                                      class="d-inline" onsubmit="return confirm('確定要刪除這條諮詢嗎？');">
                                    <button type="submit" class="btn btn-sm btn-outline-danger">刪除</button>
                                </form>
                            </div>
                        </td>
                    </tr>

                    <!-- 消息详情模态框 -->
                    <div class="modal fade" id="messageModal{{ contact.id }}" tabindex="-1">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title">諮詢詳情</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                                </div>
                                <div class="modal-body">
                                    <p class="mb-2"><strong>姓名：</strong>{{ contact.name }}</p>
                                    <p class="mb-2"><strong>電話：</strong>{{ contact.phone }}</p>
                                    <p class="mb-2"><strong>郵箱：</strong>{{ contact.email }}</p>
                                    <p class="mb-2"><strong>提交時間：</strong>{{ contact.created_at.strftime('%Y-%m-%d %H:%M') }}</p>
                                    <hr>
                                    <p class="mb-0"><strong>諮詢內容：</strong></p>
                                    <p class="mt-2">{{ contact.message }}</p>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">關閉</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    {% endfor %}
                </tbody>
            </table>
        </div>

        <!-- 分页 -->
        {% if contacts.pages > 1 %}
        <nav class="mt-4">
            <ul class="pagination justify-content-center">
                <li class="page-item {{ 'disabled' if not contacts.has_prev }}">
                    <a class="page-link" href="{{ url_for('admin.contacts', page=contacts.prev_num, status=current_status) }}">
                        上一頁
                    </a>
                </li>
                {% for page_num in contacts.iter_pages(left_edge=2, left_current=2, right_current=3, right_edge=2) %}
                    {% if page_num %}
                        <li class="page-item {{ 'active' if page_num == contacts.page }}">
                            <a class="page-link" href="{{ url_for('admin.contacts', page=page_num, status=current_status) }}">
                                {{ page_num }}
                            </a>
                        </li>
                    {% else %}
                        <li class="page-item disabled"><span class="page-link">...</span></li>
                    {% endif %}
                {% endfor %}
                <li class="page-item {{ 'disabled' if not contacts.has_next }}">
                    <a class="page-link" href="{{ url_for('admin.contacts', page=contacts.next_num, status=current_status) }}">
                        下一頁
                    </a>
                </li>
            </ul>
        </nav>
        {% endif %}
    </div>
</div>
{% endblock %} 